デザイナーから見たProflly (月刊Proflly2022年6月号)

5月からProfllyチームにデザイナーとして加入しましたisodaです。 私たちのチームでは、 Profllyというプロフィールビューアーサービスを開発・提供しています。

これまで社内ユーザーとしてProfllyに接してきましたが、デザインする側になったことで見えてきたことについて綴っていきます。

TOPから使いたい機能へすぐアクセスできるシンプルさ

先日、お客様に使用状況をヒアリングする機会があり「シンプルで使いやすい」という感想をいただきました。私自身も諸々シンプルゆえに入社してすぐ使えるようになった記憶があります。 サイトマップもシンプルで整然としています。

プロフィール閲覧機能やサンクス機能、自身のプロフィール編集まで主要な機能はTOPページから遷移してすぐ使うことが可能です。

UIもシンプル

Profllyは機能だけでなくUIもシンプルさを追求しています。UIはVuetifyというUIフレームワークを使用しております。VuetifyはGoogle提唱のMaterial Designの設計に基づいて作られているため、ヴィジュアルからモーションまで直感的で使いやすいです。Material Designを元にしているということは、GoogleのサービスやAndroidユーザーからは使い慣れたデザインということになります。 基本はVuetifyを参考にし、該当コンポーネントがない場合は１から作りますが、迷うことなく作成が可能になっています。

無料のUI Kit配布もあるので、興味ある方はダウンロードしてみてください。LightとDarkが準備されていて便利です！

デザインデータの管理もシンプル

デザインツールはFigmaを利用しています。 タスク管理の方法としてチーム全体でGitHubを利用しており、Figmaの作業ページもGitHubのissueと合わせています。（作業ページ名の頭にはBranchをつけています。）Masterと作業ページを分けることで事故を防ぐことができ、改修のアーカイブも保持できます。最初にこの運用方法を選択してくれたデザイナーに感謝です。さらにissueとページ名を合わせていることで、エンジニアさんとのやりとりが円滑になっている…はずです！
一番上のMasterページは最新のデザインデータを格納しています。

ピクチャー機能が追加

以前から「マイプロフィールにプロフィール画像以外にも写真や画像を追加できたらいいのに」と言うご意見がありましたが、この度ついにピクチャー機能が実装されました！ 自分の載せたい写真や画像を３枚までアップロードできます。家族の写真（子供や猫、犬の写真）をアップしたり、イラストをや写真などの自分の作品をアップしたりと自由に使うことができます。
ピクチャー機能の使い方を詳しく知りたい場合はこちら : ピクチャー機能の使い方

デザイナーとしては、ビジュアルを登録できるのは嬉しいですね！

さいごに

シンプルで使いやすいProflly、これから携わる身としてはその良さを生かしながらさらなるユーザーの要望に応えられるサービスにしていきたいです。 より多くの企業のコミュニケーションを支えるツールとしてこれからも改善を続けていきます。今後のProfllyの改善にご期待ください！